::-webkit-progress-inner-element
非标准: 该特性尚未标准化。我们不建议在生产环境中使用非标准特性,因为它们在浏览器中的支持有限,且可能发生变化或被移除。不过,在没有标准选项的特定情况下,它们可以作为合适的替代方案。
::-webkit-progress-inner-element
CSS 伪元素选择了 <progress>
元素。他是 ::-webkit-progress-bar
伪元素的父元素。
备注:
为了使 ::-webkit-progress-value
生效, <progress>
元素的-webkit-appearance
需要设置为 none
。
示例
HTML
html
<progress value="10" max="50"></progress>
CSS
css
progress {
-webkit-appearance: none;
}
::-webkit-progress-inner-element {
border: 2px solid black;
}
结果
应用了上述样式的进度条如下:
规范
不属于任何规范。这是 WebKit/Blink 专有的一个伪元素。
浏览器兼容性
参考
-
The pseudo-elements used by WebKit/Blink to style other parts of a
<progress>
element: ::-moz-progress-bar
::-ms-fill